<script>
import { Loading, Message } from 'element-ui';

export default {
  data() {
    return {
        loading:false,
        params: {
        pageNum: 1,
        pageSize: 10,
        domesticName: "",
        domesticStatus: "",
        startTime: "",
        endTime: "",
      },
      domesticData:[],
      radio:'',
      page:{
        pageSize:5,
        pageNum:1,
        total:100
      }
    };
  },
  methods: {
    get(){
        this.loading = true
        this.$http.get('/domestic/querySearchDomesticServiceList',{params:this.params})
        .then(res=>{
            console.log(res.data);
            if(res.data.status == 200){
                let data = res.data.data
                this.domesticData = data.list
                this.page.total = data.total
                Message({
                    type:'success',
                    message:'获取数据成功'
                })
                this.loading = false
            }else{
                Message({
                    type:'error',
                    message:'获取数据失败'
                })
            }
        })
        .catch(e=>{
            console.log('error'+e);
        })
    },
    handleSizeChange(val){
        this.params.pageSize = val
        this.get()
    },
    handleCurrentChange(val){
        this.params.pageNum = val
        this.get()
    },
  },
  watch:{
    radio(){
        this.params.domesticStatus = this.radio
        this.get()
    }
  },
  mounted() {
    this.get()
  },
};
</script>

<template>
  <div>
    <div>
        状态：    <el-radio-group v-model="radio">
      <el-radio-button label="">全部</el-radio-button>
      <el-radio-button label="0">上架</el-radio-button>
      <el-radio-button label="1">下架</el-radio-button>
    </el-radio-group>
    </div>
    <el-table :data="domesticData" height="550" border style="width: 100%" :Loading="loading">
      <el-table-column prop="domesticServiceId" label="服务ID" > </el-table-column>
      <el-table-column prop="domesticServiceName" label="服务名字"> </el-table-column>
      <el-table-column prop="domesticServiceImage" label="服务照片"> </el-table-column>
      <el-table-column prop="salesVolume" label="销量"> </el-table-column>
      <el-table-column prop="domesticServiceSort" label="虚拟销量"> </el-table-column>
      <el-table-column prop="addTime" label="添加时间"> </el-table-column>
      <el-table-column prop="domesticServiceStatus" label="状态">
        <template slot-scope="scoped">
            <el-button type="success" plain v-if="scoped.row.domesticServiceStatus == 0">上架</el-button>
            <el-button type="danger" plain v-if="scoped.row.domesticServiceStatus == 1">下架</el-button>
        </template>
      </el-table-column>
      <el-table-column label="操作"></el-table-column>

    </el-table>
        <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="page.pageNum"
      :page-sizes="[5, 10, 20, 50]"
      :page-size="page.pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="page.total">
    </el-pagination>
  </div>
</template>
<style scoped>

</style>